
<ion-header>
  <ion-navbar>
    <ion-title>图形化报表界面</ion-title>
  </ion-navbar>
</ion-header>


<ion-content padding>

  <ion-card>
    <ion-card-header>Pie Chart</ion-card-header>
    <ion-card-content>
      <canvas #pieCanvas></canvas>
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-card-header>Bar Chart</ion-card-header>
    <ion-card-content>
      <canvas #barCanvas></canvas>
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-card-header>Doughnut Chart</ion-card-header>
    <ion-card-content>
      <canvas #doughnutCanvas></canvas>
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-card-header>Half Doughnut Chart</ion-card-header>
    <ion-card-content>
      <canvas #halfDoughnutCanvas></canvas>
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-card-header>Line Chart</ion-card-header>
    <ion-card-content>
      <canvas #lineCanvas></canvas>
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-card-header>Radar Chart</ion-card-header>
    <ion-card-content>
      <canvas #radarCanvas></canvas>
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-card-header>Polar Area Chart</ion-card-header>
    <ion-card-content>
      <canvas #polarCanvas></canvas>
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-card-header>Bubble Chart</ion-card-header>
    <ion-card-content>
      <canvas #bubbleCanvas></canvas>
    </ion-card-content>
  </ion-card>

  <ion-card>
    <ion-card-header>Mixed Chart</ion-card-header>
    <ion-card-content>
      <canvas #mixedCanvas></canvas>
    </ion-card-content>
  </ion-card>

</ion-content>
